<script setup lang="ts">
  import { ref, watch, onMounted, computed } from 'vue'
  import { Handle, Position, useVueFlow, useHandle, handleElement } from '@vue-flow/core'
  import type { Node } from '@vue-flow/core'
  import BaseNode from '../base-node/index.vue'
  import CaseItem from '../components/case-item.vue'
  const props = defineProps<Node>()

  const nodeInfo = ref<Node>({
    ...props,
    id: '4',
    type: 'switch',
    data: {
      label: '条件分支',
      icon: 'material-symbols:switch-access',
      content: [
        {
          id: 11,
          conidtionsRelationship: 1, // 1:并且 2:或者
          conditions: [
            {
              id: 1,
              quoteType: '输入',
              quoteValue: '1',
              condition: '等于',
              compareType: 1, //变量  常量
              compareKey: '大模型',
              compareValue: 'asd',
            },
            {
              id: 1,
              quoteType: '输入',
              quoteValue: '5',
              condition: '大于',
              compareType: 2, //变量  常量
              compareKey: '大模型',
              compareValue: 'qwe',
            },
          ],
        },
        {
          id: 22,
          conidtionsRelationship: 2, // 1:并且 2:或者
          conditions: [
            {
              id: 1,
              quoteType: '输入',
              quoteValue: '1',
              condition: '等于',
              compareType: 1, //1:常量 2:变量
              compareKey: '大模型',
              compareValue: 'asd',
            },
            {
              id: 2,
              quoteType: '输入',
              quoteValue: '5',
              condition: '大于',
              compareType: 2, //1:常量 2:变量
              compareKey: '大模型',
              compareValue: 'qwe',
            },
            {
              id: 3,
              quoteType: '输入',
              quoteValue: '5',
              condition: '大于',
              compareType: 2, //1:常量 2:变量
              compareKey: '大模型',
              compareValue: 'qwe',
            },
            {
              id: 4,
              quoteType: '输入',
              quoteValue: '1',
              condition: '等于',
              compareType: 1, //1:常量 2:变量
              compareKey: '大模型',
              compareValue: 'asd',
            },
          ],
        },
        {
          id: 33,
          conidtionsRelationship: 1, // 1:并且 2:或者
          conditions: [
            {
              id: 1,
              quoteType: '输入',
              quoteValue: '1',
              condition: '等于',
              compareType: 2, //变量  常量
              compareKey: '大模型',
              compareValue: 'asd',
            },
            {
              id: 1,
              quoteType: '输入',
              quoteValue: '5',
              condition: '大于',
              compareType: 1, //变量  常量
              compareKey: '大模型',
              compareValue: 'qwe',
            },
          ],
        },
        {
          id: 44,
        },
      ],
      desc: '你好，我是一个条件分支，我只能有1个测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试',
    },
  })
</script>

<template>
  <BaseNode :meta="nodeInfo">
    <!-- 分支 -->
    <div class="flex flex-col w-full">
      <CaseItem
        v-for="(item, index) in nodeInfo.data.content"
        :key="item.id"
        :item="item"
        :casteTitle="
          index == 0 ? 'IF' : index == nodeInfo.data.content.length - 1 ? 'ELSE' : 'ELSE IF'
        "
      />
    </div>
  </BaseNode>
</template>
<style scoped lang="less">
  .box {
    min-width: 120px;
    height: 40px;
    line-height: 40px;
    text-align: center;
  }
</style>
